import type { LocaleSetting, LocaleType } from "/#/config"

import { defineStore } from "pinia"
import { store } from "/@/store"

import { LOCALE_KEY } from "/@/enums/cacheEnum"
import { createLocalStorage } from "/@/utils/cache"
import { localeSetting } from "/@/settings/localeSetting"

const ls = createLocalStorage()

const lsLocaleSetting = (ls.get(LOCALE_KEY) || localeSetting) as LocaleSetting

interface LocaleState {
  localInfo: LocaleSetting
  pathTitleMap: object
}

export const useLocaleStore = defineStore({
  id: "app-locale",
  state: (): LocaleState => ({
    localInfo: lsLocaleSetting,
    pathTitleMap: {},
  }),
  getters: {
    getShowPicker(): boolean {
      return !!this.localInfo?.showPicker
    },
    getLocale(): LocaleType {
      return this.localInfo?.locale ?? "zh_CN"
    },
    getPathTitle: (state) => {
      return (path) => state.pathTitleMap[path]
    },
  },
  actions: {
    /**
     * Set up multilingual information and cache
     * @param info multilingual info
     */
    setLocaleInfo(info: Partial<LocaleSetting>) {
      this.localInfo = { ...this.localInfo, ...info }
      ls.set(LOCALE_KEY, this.localInfo)
    },
    /**
     * Initialize multilingual information and load the existing configuration from the local cache
     */
    initLocale() {
      this.setLocaleInfo({
        ...localeSetting,
        ...this.localInfo,
      })
    },
    // 配置成菜单后，打开菜单，显示名称未展示为菜单名称
    setPathTitle(path, title) {
      this.pathTitleMap[path] = title
    },
  },
})

// Need to be used outside the setup
export function useLocaleStoreWithOut() {
  return useLocaleStore(store)
}
